<template>
    <div class="config">
        <el-form :model="config" label-width="120px" :rules="newsFormRules" ref="newsFormRef">     
            <el-form-item label="支付状态" prop="payStatus">
                <el-switch
              v-model="config.payStatus"
              active-value="2"
              inactive-value="1"
             
            />
            </el-form-item>    
            <el-form-item label="内容" prop="explainContent">
                <editor @event="handleChange" :content="config.explainContent"></editor>
            </el-form-item>
            
            <el-form-item label="">
              <el-button type="primary" @click="submitForm()">添加</el-button>
            </el-form-item>
          </el-form>
    </div>
</template>

<script setup>
import {ref,reactive,onMounted} from 'vue'
import editor from '../../components/editor/editor.vue'
import { Plus, } from "@element-plus/icons-vue";
import upload from '@/util/upload';
import { ElMessage } from "element-plus";
import { useRouter } from "vue-router";
const router = useRouter();
import axios from "axios"
const newsFormRef = ref();
onMounted(() => {
    getConfig()
})
const config = ref({
    _id:"",
    payStatus:"",
    explainContent:"",
    
})
const handleChange = (data)=> {
    config.value.explainContent = data;
    console.log(data);
    console.log('config',config)
}

const newsFormRules = reactive({
    content:[{ required: true, message: "请输入内容", trigger: "blur" }],
})

const submitForm = () => {
    newsFormRef.value.validate(async(valid) => {
        if(valid) {
            // console.log("newsForm",newsForm);
            const res = await axios.post("/adminapi/AdminConfig/update",config.value);
            if(res.data.code == 200) {
                ElMessage.success("修改成功");
                // router.push('/newsManage/newsList');
            }else {
                ElMessage.error("修改失败");
            }
        }
    })
}
const getConfig =async () => {
    const res = await axios.get("/adminapi/AdminConfig/getAdminConfig");
    if(res.data.code == 200) {
        if(!res.data.data.explainContent) {
            res.data.data.explainContent = ''
        }
         console.log('res.data.data',res.data.data)
        config.value._id = res.data.data._id
        config.value.explainContent = res.data.data.explainContent
         config.value.payStatus =  res.data.data.payStatus
        console.log('config.value',config.value)
    }
}
</script>

<style lang="scss" scoped>
.cover {
  width: 178px;
  height: 178px;
}
</style>